<template>
  <div class="content-layout-body">
    <base-search
      :title="t('keys.mySubmitted')"
      :schema="getISubmittedSearchData()"
      :expand="true"
      @search-submit="searchSubmit"
      @reset-submit="resetSubmit"
      v-permission="['home.approvalCenter.ISubmitted.see']"
    />
    <base-table
      ref="tableRefCom"
      v-loading="loading"
      border
      :selection="false"
      reserveSelection
      :row-style="{ cursor: 'pointer' }"
      row-key="id"
      rowKey="id"
      :columns="getISubmittedList()"
      :data="tableData"
      :pagination="{
        currentPage: defaultParams.page,
        total: total,
        onSizeChange: handleSizeChange,
        onCurrentChange: handleCurrentChange
      }"
      v-permission="['home.approvalCenter.ISubmitted.see']"
    >
      <template #ticketCode="scope">
        <el-button type="info" link @click.stop="goToBeApprovedDetails(scope.row)">{{ scope.row.ticketCode }}</el-button>
      </template>
      <template #enabledFlag="scope">
        {{ scope.row.enabledFlag ? t('keys.Published') : t('keys.draft') }}
      </template>
      <template #action="scope">
        <!-- <el-button type="info" link @click.stop="textareaModelClick('Urge', scope.row)" v-if="scope.row.status == 'UNDER_APPROVAL'">催办</el-button> -->
        <el-button
          type="danger"
          link
          @click.stop="textareaModelClick('withdraw', scope.row)"
          v-if="scope.row.status == 'UNDER_APPROVAL'"
          v-permission="['home.approvalCenter.ISubmitted.edit']"
          >{{ t('keys.withdraw') }}</el-button
        >
      </template>
    </base-table>
  </div>
  <textarea-model ref="textareaModelChild" :textareaModelObj="textareaModelObj" @textareaModel-submit="textareaModelSubmit"></textarea-model>
</template>

<script setup>
import { ref, reactive, onActivated, nextTick } from 'vue'
import { useRouter } from 'vue-router'
import { useBasicData } from './hooks/useBasicData'
import { getISubmittedList } from './tableColumn'
import { getISubmittedSearchData } from './hooks/useSearchData'
import { ElMessage, ElMessageBox } from 'element-plus'
// import ZcbSearch from 'components/zcb-search'
// import BasicTable from 'components/table/basicTable.vue'
import textareaModel from './component/textareaModel.vue'
import { ERR_OK } from 'config/statusCode'
import { mySubmittedListApi, mySubmittedRevokeApi } from 'api/personalCenter'
import { getUserInfo } from 'utils/headerToken'
import { useI18n } from 'vue-i18n'
const { t } = useI18n() // 中英文
const router = useRouter()
const {
  tableRefCom,
  defaultParams,
  tableData,
  loading,
  total,
  comName,
  rowData,
  handleSizeChange,
  handleCurrentChange,
  handleSelectionChange,
  onRowClick,
  clearSelectionKeys,
  getList,
  searchSubmit,
  resetSubmit
} = useBasicData({
  listFun: mySubmittedListApi
})

// 每次都执行
onActivated(() => {
  getList()
})
const textareaModelChild = ref(null)
const textareaModelObj = reactive({
  title: '',
  copywriting: '', // 文案
  copywritingBill: '' // span包裹的文案
})
const typeCode = ref('Urge') // Urge-催办 withdraw-撤回
const rowLineData = ref({})
const textareaModelClick = (type, row) => {
  let tit = `${row.ticketCode}${row?.ticketName ? '-'+row?.ticketName : ''}`
  //催办
  if (type == 'Urge') {
    textareaModelObj.title = t('keys.Urge')
    textareaModelObj.copywriting = `${t('keys.Urge_the_current_approver_to_approve')} <span>${tit}</span> ？`
  } else {
    // 撤回
    textareaModelObj.title = t('keys.withdraw')
    textareaModelObj.copywriting = `${t('keys.Whether_to_withdraw')} <span>${tit}</span> ${t(
      'keys.Approval_process'
    )}？`
  }
  rowLineData.value = row
  nextTick(() => {
    textareaModelChild.value.showModel()
  })
}
//
const textareaModelSubmit = async (val) => {
  if (typeCode == 'Urge') {
    // 催办
  } else {
    let param = {
      empId: getUserInfo().empId,
      processInstanceId: rowLineData.value.processInstanceId,
      revokeReason: val.description
    }
    // 撤回
    const { code, data } = await mySubmittedRevokeApi(param, rowLineData.value.processInstanceId)
    if (code === ERR_OK) {
      ElMessage.success(t('keys.withdraw_succeeded'))
      setTimeout(() => {
        clearSelectionKeys()
        getList()
      }, 1000)
    }
  }
}
const goToBeApprovedDetails = (row) => {
  router.push({
    name: 'ISubmittedDetails',
    query: {
      instanceId: row.processInstanceId,
      ticketCode: row.ticketCode,
      ticketName: row.ticketName,
      source: 'preview'
    }
  })
}
</script>
